import { reactive, watch, ref } from 'vue';
import { food } from "./UseFood";
import { SnakeStyle, Snakebody } from '../types/index'
import { elData } from './UseHelp'
// 判断蛇头的那个属性改变
let Isleft: boolean
// 创建一个属性用来记录游戏是否结束
let isLive = ref(true as boolean);
//控制方向
let isleft = ref('');
// 蛇头坐标
const SnakeStyle: SnakeStyle = reactive({
  left: 0,
  top: 0
})
//身体的数据
const Snakebody: Snakebody[] = reactive([
  {
    index: new Date().getTime(),
    str: '',
    left: 0,
    top: 0,
    class: 'NoShow',
  }
])
//开启监视蛇头left

watch(() => SnakeStyle.left, (newValue, oldValue) => {
  //检测是否开启无敌模式,没开启进入判断
  if (elData.value3 == false) {
    // 蛇头范围是否合法（0-500）
    if (newValue < 0 || newValue > 500) {
      //进入判断说明蛇撞墙了
      isLive.value = false;
      alert('蛇撞墙了！游戏结束');
      throw new Error("蛇撞墙了！游戏结束");
    }
  }
  Isleft = true;
  //身体移动
  BodyMove(oldValue)
  //是否撞到自己
  TouchSnakeBody()
})
//开启监视蛇头top
watch(() => SnakeStyle.top, (newValue, oldValue) => {
  if (elData.value3 == false) {
    // 蛇头范围是否合法（0-330）
    if (newValue < 0 || newValue > 390) {
      isLive.value = false;
      alert('蛇撞墙了！游戏结束');
      throw new Error("蛇撞墙了！游戏结束");
    }
  }
  Isleft = false;
  BodyMove(oldValue)
  TouchSnakeBody()
})
//增加身体
function addBody() {
  // 定义div
  const Snakehtml = {
    index: new Date().getTime(),
    str: '',
    left: 0,
    top: 0,
    class: '',
  }
  Snakebody.push(Snakehtml)
}
//身体移动
function BodyMove(oldValue: number) {
  //遍历蛇身体数组
  let X: number
  let Y: number
  // 设置第一个身体的位置
  if (Isleft) {
    X = oldValue
    Y = SnakeStyle.top

  } else {
    Y = oldValue
    X = SnakeStyle.left

  }
  for (let i = Snakebody.length - 1; i > 0; i--) {
    Snakebody[0].left = X
    Snakebody[0].top = Y
    // // 获取前边身体的位置
    let XX = Snakebody[i - 1].left
    let YY = Snakebody[i - 1].top
    //将值设置到当前身体上
    Snakebody[i].left = XX
    Snakebody[i].top = YY
  }
}
//检测是否撞到自己
function TouchSnakeBody() {
  // 获取所有的身体，检查其是否和蛇头的坐标发生重叠
  for (let i = 1; i < Snakebody.length; i++) {
    if (Snakebody[i].left == SnakeStyle.left && Snakebody[i].top == SnakeStyle.top) {
      // 进入判断说明蛇头撞到了身体，游戏结束
      //检测是否开启无敌模式
      if (elData.value3 == true) return
      isLive.value = false;
      alert('撞到自己了！游戏结束');
      throw new Error("撞到自己了！游戏结束");
    }
  }
}
export {
  SnakeStyle,
  Snakebody,
  addBody,
  isLive,
  isleft
}
